import React from 'react'
import {NavLink} from 'react-router-dom'
import { connect } from 'react-redux'
import './serviceStyle.less'

const mapStateToProps = (state) => {
  return {
      userInfo: state.app.userInfo
  }
}
class Service extends React.Component<any, any> {
  public constructor(props) {
    super(props)
    this.state = {
      ipaddr: {
        ip: '',
        addr: ''
      }
    }
  }

  public componentWillMount() {

  }

  public render() {
    console.log(this.props)
    const {inviteId, tip} = this.state
    return <div className="view-page center-view">
      <div className="record-top text-center">
        <img src="img/userCenter/ballons.png?v=20181201" className="ballon animated infinite fadeInUp" alt="" />
        <img src="img/app/shuaishuai-hy-text.png?v=20181201" className="shuai-text animated infinite" alt="" />
      </div>
      <div className="record-middle">
        <div className="service-top">
          <img className="full pos-abs" src="img/userCenter/info-kuang1.png?v=20181201" alt=""/>
          <div className="underbg">
            <img className="service-header" src={this.props.userInfo.headUrl} alt=""/>
            <div className="service-top-info mlr-6">
              <div className="mtr-3">{this.props.userInfo.nickname}<span className="mlr-10">游戏ID: {this.props.userInfo.lftid}</span></div>
              <div className="mtr-3">寻求客服帮助时,请告知游戏ID
              </div>
            </div>
          </div>
        </div>
        <div className="service-bottom text-center">
          <img src="img/userCenter/service-qrcode-1221.png?v=20181201" alt=""/>
        </div>
      </div>
      <div className="usercenter-bottom">
        <img className="bar" src="img/app/kuang-bottom.png?v=20181201" alt=""/>
        <div className="text">
          <img className="bottom-title" src="img/app/bottom-title/custom.png?v=201811272534" alt=""/>

        </div>
        <NavLink to="/UserCenter"><img className="back" src="img/app/back.png?v=20181201" alt=""/></NavLink>
      </div>
    </div>
  }

}

export default connect(mapStateToProps)(Service)